<template>
  <div class="container">
    <baleTable :tableData="tableData" :tableHead="tableHead" :isSearch="true" :tableLoading="tableLoading" :page="page"
      @pageSizeChange="pageSizeChange" @handleCurrentChange="handleCurrentChange" @searchMethods="searchMethods"
      @tableSortChange="tableSortChange" @handleRowClick="handleRowClick" ref="baleTable">
      <template #headLeft>
        <!--    <el-button size="small" type="success" @click="importData()">数据导入</el-button> -->
        <el-button size="small" type="primary" @click="showDialog('')">添加</el-button>
        <!-- <div
          class="ml10 tableStats-btn tableStats-btn-active"
          @click="showDialog('')"
        >
          添加
        </div> -->
      </template>
      <template #pic="{ scope }">
        <div @click.stop="">
          <tablePrImg v-if="scope.row.pic" :imgSrc="scope.row.pic" :prImgList="[scope.row.pic]" />
        </div>
      </template>

      <!-- 机构名称 -->
      <template #unit_id="{ scope }">
        {{formatterUnitId(scope.row.unit_id)}}
      </template>

      <!-- 等级 -->
      <template #top="{ scope }">
        <p @click.stop="">
          <el-switch :value="scope.row.top" :active-value="1" :inactive-value="0" active-text="已置顶" inactive-text="未置顶"
            @change="(val)=>handleTopSwitch(val,scope.row.id)">
          </el-switch>
        </p>

      </template>

      <template #down="{ scope }">
        <p @click.stop="">
          <el-switch :value="scope.row.down" :active-value="0" :inactive-value="1" active-text="上架" inactive-text="下架"
            @change="(val)=>handleDownSwitch(val,scope.row.id)">
          </el-switch>
        </p>

      </template>

      <!--    操作 -->
      <template #tableOperation="{ scope }">
        <!--   <el-button type="danger" size="small" @click="userList(scope.row.id)"
          >用户订单列表</el-button
        > -->
        <!--  <el-button type="info" size="small" @click="addQuality(scope.row.id)"
          >资质申请列表</el-button
        > -->
        <!--   <el-button type="success" size="small" @click="resetButton(scope.row.id)" icon="el-icon-key">重置密码</el-button> -->
        <el-button type="primary" size="small" @click="showDialog(scope.row)">编 辑</el-button>
        <el-button type="danger" size="small" @click="deList(scope.row.id)">删除</el-button>
      </template>
    </baleTable>

    <menuDialog ref="dialognur" :subDepartMentArr="subDepartMentArr" @refresh="getTableData"></menuDialog>
    <ImportData @refresh="getTableData" ref="importData" />

    <!--   <userList ref="userListDialog"></userList> -->
  </div>
</template>

<script>

import {
  ApigetArticle,
  ApiDelArticle,
  ApiarticleTop,
  ApiarticleDown
} from "@a/index";
import { tableHead } from "./config";
import menuDialog from "./component/basicDialog.vue";
//获取用户列表数据
/* import userList from "./component/userList.vue"; */
import tablePrImg from "@/components/tablePrImg.vue";
import ImportData from "./component/importData.vue";
export default {

  components: {
    menuDialog,
    tablePrImg,
    ImportData,
    /*   userList, */
  },
  data() {
    return {
      tableHead,
      tableData: [],
      page: {
        page: 1,
        size: 25,
        total: 0,
      },
      tableLoading: false,
      searchParams: {},
      sortParams: {},
      editFormVisible: false,
      btnLoading: false,
      unitList: [],
      subDepartMentArr: [],
      consultation_typeArr: [
        { name: "全部", code: "0" },
        { name: "图文问诊", code: "1" },
        { name: "视频问诊", code: "2" },
      ],
    };
  },
  mounted() {
    this.getTableData();
  },

  methods: {
    handleTopSwitch(val, id) {
      const str = val ? "置顶" : "取消置顶"
      this.$confirm(
        `确定${str}该篇科普吗？`,
        "提示",
        {
          confirmButtonText: "确认",
          cancelButtonText: "取消",
          dangerouslyUseHTMLString: true,
          center: true,
        }
      )
        .then(() => {
          ApiarticleTop({ top: val }, id).then(_ => {
            this.getTableData()
          })
        })
        .catch(() => { });
    },

    handleDownSwitch(val, id) {
      const str = val ? "下架" : "上架"
      this.$confirm(
        `确定${str}该篇科普吗？`,
        "提示",
        {
          confirmButtonText: "确认",
          cancelButtonText: "取消",
          dangerouslyUseHTMLString: true,
          center: true,
        }
      )
        .then(() => {
          ApiarticleDown({ down: val }, id).then(_ => {
            this.getTableData()
          })
        })
        .catch(() => { });
    },





    importData() {
      this.$refs.importData.show();
    },


    //编辑界面
    onEdit() { },
    showDialog(val) {
      this.$refs.dialognur.show(val);
    },
    /*    userList(id) {
      this.$router.push({
        name: "detail",
        params: { id },
      });
    }, */
    getTableData(params = {}) {
      let postParams = {
        ...params,
        ...this.searchParams,
        ...this.sortParams,
        ...this.page,
      };
      this.tableLoading = true;
      ApigetArticle(postParams).then((res) => {
        let { data, page } = res;
        this.tableData = data;
        this.page.total = page.total;
        this.tableLoading = false;
      });
    },
    searchMethods(params) {
      this.searchParams = {};
      this.page.page = 1;
      this.searchParams = params;
      this.getTableData();
    },
    pageSizeChange(val) {
      this.page.size = val;
      this.getTableData();
    },
    handleCurrentChange(val) {
      this.page.page = val;
      this.getTableData();
    },
    tableSortChange(params) {
      if (params.sort_str) {
        this.sortParams = { ...this.sortParams, ...params };
      } else {
        delete this.sortParams.sort_str;
        delete this.sortParams.sort_order;
      }
      this.page.page = 1;
      this.getTableData();
    },

    handleRowClick(params) { },
    //shanchu
    deList(id) {
      this.$confirm("是否删除该数据项?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        center: true,
        type: "warning",
      })
        .then((res) => {
          ApiDelArticle(id).then((res) => {
            this.$message.success("操作成功！");
            this.getTableData();
          });
        })
        .catch((err) => { });
    },

    /*    resetButton(id) {
         this.$confirm("是否确认重置密码?", "提示", {
           confirmButtonText: "确定",
           cancelButtonText: "取消",
           center: true,
           type: "warning",
         })
           .then((res) => {
             ApiResetPassword(id).then((res) => {
               this.$alert("重置成功，该员工初始密码为：123456", "提示", {
                 confirmButtonText: "确定",
                 callback: (action) => { },
               });
               this.getTableData();
             });
           })
           .catch((err) => { });
       }, */

  },
  filters: {},
};
</script>

<style lang="less" scoped></style>
